<template>
  <div class='dex'>
    <div class='tu'>
      <img src="" alt="">
      <div class='menu'>
        <h3>医联体平台</h3>
        <div class='menu_bott'>
          <h4>医生登陆</h4>
          <div class='menu_box'>
            <form action="">
              <input type="text" placeholder="手机号" v-on:blur="">
              <input type="password" placeholder="密码">
              <button v-on:click="">登陆</button>
            </form>
          </div>
        </div>
      </div>
    </div>
    <p></p>
  </div>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .dex{width:100%;height:100%;background:#6A84D9;}
  .tu{width:1200px;height:100%;background-color:#6A84D9;margin:60px auto;position:relative; }
  .menu{width:300px;height:400px;position:absolute;right:100px;top:50px;}
  .menu h3{color:white;text-align:center;margin-bottom:40px;}
  .menu_bott{width:300px;height:300px;background:#D3E2FF;border-radius:20px;position:relative;}
  .menu_bott h4{color:#7D98DB;position:absolute;top:10px;left:30px;}
  .menu_box {position:absolute;top:40px;}
  .menu_bott input{border:0;width:260px;height:40px;border-radius:5px;border:1px solid #ccc;margin-left:20px;margin-top:20px;outline:none;font-size:16px;}
  .menu_bott button{width:260px;height:40px;background:#6886D4;color:white;border-radius:10px;margin-left:20px;margin-top:50px;}
</style>
